<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link rel="stylesheet" href="../plugins/layui/css/layui.css" media="all" />
		<link rel="stylesheet" href="../css/global.css" media="all">
		<link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.min.css">
		<link rel="stylesheet" href="../css/table.css" />
	</head>

	<body>
		<div class="admin-main">

			<blockquote class="layui-elem-quote">
				<a href="javascript:;" class="layui-btn layui-btn-small" id="add-db">
					<i class="layui-icon">&#xe608;</i> 添加
				</a>
				<a href="javascript:;" class="layui-btn layui-btn-small layui-btn-danger" id="delete-db"><i class="layui-icon"></i> 删除</a>
				<!--<a href="javascript:;" class="layui-btn layui-btn-small" id="add">
					<i class="layui-icon">&#xe608;</i> 添加信息
				</a>
				<a href="#" class="layui-btn layui-btn-small" id="import">
					<i class="layui-icon">&#xe608;</i> 导入信息
				</a>
				<a href="#" class="layui-btn layui-btn-small">
					<i class="fa fa-shopping-cart" aria-hidden="true"></i> 导出信息
				</a>
				<a href="javascript:;" class="layui-btn layui-btn-small" id="search">
					<i class="layui-icon">&#xe615;</i> 搜索
				</a>-->
			</blockquote>
			<fieldset class="layui-elem-field">
				<legend>数据列表</legend>
				<div class="layui-field-box">
					<table class="site-table table-hover">
						<thead>
							<tr>
								<th><input type="checkbox" id="selected-all"></th>
								<!--<th>ID</th>-->
								<th>名称</th>
								<th>描述</th>
								<th>状态</th>
								<th>创建时间</th>
								<th>更新时间</th>
								<th>操作</th>
							</tr>
						</thead>
						<tbody class="jqList">
							<!--<tr>
								<td><input type="checkbox"></td>
								<td>Layui</td>
								<td>
									<a href="/manage/article_edit_1">演示站点发布成功啦。</a>
								</td>
								<td>Beginner</td>
								<td>2016-11-16 11:50</td>
								<td>1298</td>
								<td style="text-align:center;"><i class="layui-icon" style="color:green;"></i></td>
								<td>
									<a href="/detail-1" target="_blank" class="layui-btn layui-btn-normal layui-btn-mini">预览</a>
									<a href="javascript:;" data-id="1" data-opt="del" class="layui-btn layui-btn-danger layui-btn-mini">删除</a>
								</td>
							</tr>-->
						</tbody>
					</table>

				</div>
			</fieldset>
			<div class="admin-table-page">
				<div id="page" class="page">
				</div>
			</div>
		</div>
		<script type="text/javascript" src="../plugins/layui/layui.js"></script>
		<script>
			layui.config({
				base: '../plugins/layui/modules/'
			});

			layui.use(['icheck', 'laypage', 'layer', 'form', 'layedit', 'laydate'], function() {
				var $ = layui.jquery,
					laypage = layui.laypage,
					layer = parent.layer === undefined ? layui.layer : parent.layer;
				$('input').iCheck({
					checkboxClass: 'icheckbox_flat-green'
				});

				//page
				//每页条数
				var num = 10;
				//当前页数
				var page = 1;
				//静态发布页根地址
				var baseUrl = 'http://61.155.85.77:8999';
				function getstatus(num){
					if(num==1){
						return '<i class="layui-icon" style="color:green;"></i>';
					}else{
						return '<i class="layui-icon" style="color:red;">ဇ</i>';
					}
				}
				function getbutton(status){
					if(status==1){
						return '禁用';
					}else{
						return '启用';
					}
				}
				$.get("/getModelCount",function(data){
					if(data.success){
						var pages = data.data['count(*)'];
						laypage({
							cont: 'page',
							pages: Math.ceil(pages/num),
							jump: function(obj, first) {
								//全选取消
								$('#selected-all').iCheck('uncheck');
								//得到了当前页，用于向服务端请求对应数据
								var curr = obj.curr;
								window.reloadPage = function(curr,num){
									$.get("/getModelListPage?page="+(curr-1)*num+'&num='+num,function(data2){
										if(data2.success){
											var arr = data2.data;
											var list = "";
											$.each(arr, function(i,e) {
												var temp = [];
												temp.push("<tr>");
												
												temp.push("<td><input type=\"checkbox\" name=\"delIds[]\" value=\""+e.id+"\"></td>");
//												temp.push("<td>"+e.id+"</td>");
												temp.push("<td>"+e.modelName+"</td>");
												temp.push("<td>"+e.modelDesc+"</td>");
												temp.push("<td style=\"text-align:center;\">"+getstatus(e.status)+"</td>");
												temp.push("<td>"+getdate(e.create_time)+"</td>");
												temp.push("<td>"+getdate(e.modify_time)+"</td>");
												temp.push("<td>\
												<a href=\"javascript:;\" data-id=\""+e.id+"\" data-status=\""+e.status+"\" class=\"layui-btn layui-btn-normal layui-btn-mini jqStatusChange\">"+getbutton(e.status)+"</a>\
												<a href=\"javascript:;\" data-id=\""+e.id+"\" class=\"layui-btn layui-btn-normal layui-btn-mini jqEdit\">修改</a>\
												<a href=\"javascript:;\" data-id=\""+e.id+"\" data-opt=\"del\" class=\"layui-btn layui-btn-danger layui-btn-mini jqDelete\">删除</a>\
												</td>");
												
												temp.push("</tr>");
												list += temp.join('');
											});
											$('.jqList').empty().append(list);
											//重新渲染checkbox样式
											$('.jqList input[type=checkbox]').iCheck({checkboxClass:'icheckbox_flat-green'});
											bindTrEvent();
										}
									})
								}
								reloadPage(curr, num);
								window.reloadDbList = function(){
									reloadPage(curr, num);
								}
								parent.window.reloadDbList = function(){
									reloadPage(curr, num);
								}
							}
						});
					}
				})
				function bindTrEvent(){
					//全选
					$('.site-table tbody tr').off('click').on('click', function(event) {
						var $this = $(this);
						var $input = $this.children('td').eq(0).find('input');
						$input.on('ifChecked', function(e) {
							$this.css('background-color', '#EEEEEE');
						});
						$input.on('ifUnchecked', function(e) {
							$this.removeAttr('style');
						});
						$input.iCheck('toggle');
					}).find('input').each(function() {
						var $this = $(this);
						$this.on('ifChecked', function(e) {
							$this.parents('tr').css('background-color', '#EEEEEE');
						});
						$this.on('ifUnchecked', function(e) {
							$this.parents('tr').removeAttr('style');
						});
					});
					//禁用
					$('.jqStatusChange').off('click').on('click',function(e){
						var $obj = $(this);
						var id = $obj.attr("data-id");
						var status = $obj.attr("data-status");
						e.preventDefault();
						e.stopPropagation();
						//post
						$.post(baseUrl+'/db_status', {id:id,status:status}, function(back){
							if(back.success){
								layer.msg('操作成功');
								window.reloadDbList();
								//change
							}else{
								layer.alert(back.error, {title:'警告'});
							}
						})
					})
					//修改
					$('.jqEdit').off('click').on('click',function(e){
						var $obj = $(this);
						var id = $obj.attr("data-id");
						e.preventDefault();
						e.stopPropagation();
						$.get(baseUrl+'/db_edit',{id:id},function(rdt){
							layer.open({
								type: 2,
								title: '修改',
								content: './db/db_edit.html',
								btn: ['保存', '关闭'],
								area: ['600px', '400px'],
								maxmin: true,
								full: function(elem) {
									var win = window.top === window.self ? window : parent.window;
									$(win).on('resize', function() {var $this = $(this);elem.width($this.width()).height($this.height()).css({top: 0,left: 0});elem.children('div.layui-layer-content').height($this.height() - 95);});
								},
								yes: function(index, layero){
								    layer.getChildFrame('#parentControlDom', index).trigger('click');
								},
								success:function(o,i){
									var $fm = o.find("iframe");
									var t = setInterval(function(){
										if(typeof($fm[0].contentWindow.loadGetDate)=='function'){
											clearInterval(t);
											$fm[0].contentWindow.loadGetDate(rdt);
										}
									}, 50);
								}
							});
						})
					})
					//删除
					$('.jqDelete').off('click').on('click',function(e){
						e.preventDefault();
						e.stopPropagation();
						var $obj = $(this);
						var id = $obj.attr("data-id");
						layer.confirm('确认删除？',{title:'提示'},function(index){
							$.post(baseUrl+'/db_delete', {id:id}, function(back){
								if(back.success){
									layer.close(index);
									window.reloadDbList();
								}else{
									layer.alert(back.error, {title:'警告'});
								}
							})
						})
					})
					$('#delete-db').off('click').on('click',function(e){
						e.preventDefault();
						e.stopPropagation();
						var $obj = $('input[name="delIds[]"]:checked');
						if($obj.length>0){
							var ids = [];
							$.each($obj, function(i,e) {
								ids.push(parseInt($(e).val()));
							});
							layer.confirm('确认删除？',{title:'提示'},function(index){
								$.post(baseUrl+'/db_delete_muti',{ids:ids},function(back){
									if(back.success){
										layer.close(index);
										window.reloadDbList();
									}else{
										layer.alert(back.error, {title:'警告'});
									}
								})
							})
						}else{
							layer.msg('无选中数据');
						}
					})
				}
				
				$('#add-db').on('click', function() {
					layer.open({
						type: 2,
						title: '添加',
						content: 'db/db_add.html',
						btn: ['保存', '取消'],
						area: ['800px', '600px'],
						maxmin: true,
						full: function(elem) {
							var win = window.top === window.self ? window : parent.window;
							$(win).on('resize', function() {var $this = $(this);elem.width($this.width()).height($this.height()).css({top: 0,left: 0});elem.children('div.layui-layer-content').height($this.height() - 95);});
						},
						yes: function(index, layero){
						    layer.getChildFrame('#parentControlDom', index).trigger('click');
						}
					});
				});
				$('#selected-all').on('ifChanged', function(event) {
					var $input = $('.site-table tbody tr td').find('input');
					$input.iCheck(event.currentTarget.checked ? 'check' : 'uncheck');
				});
			});
		</script>
	</body>

</html>